<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta charset="utf-8">
	<title>茶品展示</title>
	
	<link rel="stylesheet" href="css/teashow.css">
	<link rel="stylesheet" href="css/.css">
</head>
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript">
 			$(document).ready(function($){
    
   				 $('#k1,#k2,#k3').click(function(){
     			   $('html,body').stop();
       				 $('html,body').animate({
          			  scrollTop:'0px'
       			 },500);
   			 });
});


  $(document).ready(function(){
 				
 				$("#k1,#k2,#k3").hide();
			  $(function () {
			    $(window).scroll(function () {
			      if ($(this).scrollTop() > 100) {
			        $('#k1,#k2,#k3').fadeIn();
			      } else {
			        $('#k1,#k2,#k3').fadeOut();
			      }
			    });
 
			    
			    $('#k1,#k2,#k3').click(function () {
			      $('body,html').animate({
			        scrollTop: 0
			      }, 'fast');
			      return false;
			    });
			  });
 
			});
  $(function(){
        $("#num-jia").on("click", function(){
            var $countInput = $(this).parent(".count").children(".input-num");
            $countInput.val($countInput.val()-0+1);
        });
        $("#num-jian").on("click", function(){
            var $countInput = $(this).parent(".count").children(".input-num");
            if ($countInput.val()-0 > 0){
                $countInput.val($countInput.val()-1);
            }
        });
    });
	$(function(){
		$("#add").click(function(){
			var count=$("#input-num").val();
			alert(count);
		location.href="CartServlet?opt=add&count="+count;	
		})
	})
  
</script>
<body>


<div id="header">
	<div class="top_con clearfix">
			<div class="logo fl"></div>
		
            <div class="nav fl">
                <div class="nav-im fl"></div>

                <ul class="fl">

                    <li><a href="index.jsp">茶坊首页</a></li>
                    <li><a href="culture.jsp">品德文化</a></li>
                    <li><a href="showtealist.jsp">茶品展示</a></li>
                    <li><a href="newsCentre.jsp">新闻中心</a></li>
                    <li><a href="#">营销服务</a></li>
                    <li><a href="#">招商联盟</a></li>
                    <li><a href="contactus.jsp">联系我们</a></li>
                    <li><a href="teashoplist.jsp">茶具商店</a></li>
                </ul>
            </div>
            <div class="login fr">
				<a href="myinfo.jsp"><img src="images/kandc/login.png" alt="" /></a>
				<p class="p1">
					<a href="<%=request.getContextPath()%>/login1.jsp">登录</a>·<a href="<%=request.getContextPath()%>/login2.jsp">注册</a>
				</p>
				<p class="p2">中/En</p>
			</div>
        
    </div>
<div class="hr">
	<p class="hr1">茶品展示</p>
	<div class="d1"></div>
	<p class="hr2">Tea Show</p>
</div>
</div>
<div id="main">
	<p class="aa">当前位置 > 茶坊首页 > 茶品展示 > 全部 > 云茗茶:</p>
	<hr class="bb">
	<div class="cc">
		<img src="images/images/1.jpg">
	</div>
	
	<div class="ff">
		<li><img src="images/images/s1.jpg"></li>
		<li><img src="images/images/s2.jpg"></li>
		<li><img src="images/images/s3.jpg"></li>
		<li><img src="images/images/s4.jpg"></li>
		<li><img src="images/images/s5.jpg"></li>
	</div>
	<div class="gg">
		<h1>${tea.name }</h1>
		<img src="images/images/jp.jpg">
		<p class="g1">品类：
			 <c:forEach var="type" items="${typelist }">
				<c:if test=" ${tea.typeid == type.id }" >
					${type.name }
				</c:if>
			</c:forEach> 
		   产地：${tea.proloc })
	</p>
		<p class="g2">${tea.shortinfo }</p>
		<a href="" class="g3">点击展开</a>
		<h2>￥${tea.price }/盒</h2>
		<p>配送至：
			<select>
				<option>河南省郑州市中原区电子商务园</option>
			</select>
			<ul class="btn-numbox">
				<span class="number">数量:</span>
					<li>
						<ul class="count">
						<c:set var="count" value="1"/>
							<span id="num-jian" class="num-jian">-</span>
							<input type="text" id="input-num" class="input-num" value="${count }">
							<span id="num-jia" class="num-jia" >+</span>
						</ul>
					</li>
			</ul>
		</p>
		<div class="g4">
			<a class="g4g" id="add" >加入购物车</a>
		</div>

	</div>
	<div class="dd"></div>
	
	<div class="xq">
		<h2>产品详情</h2>
		<p>${tea.shortinfo }</p>
		<h2>部分展示</h2>
		
		<img src="images/images/in1.jpg">
		<img src="images/images/in2.jpg" class="in">
		<div class="order">
			<span class="line"></span>
			<span class="txt">推荐</span>
			<span class="line"></span>
		</div>
		<div class="tj">
			<figure class="pic1">
				<img src="images/images/t1.jpg">
				<figcaption>
					<h5>茶化石</h5>
					<p>四川 普洱生茶</p>
				</figcaption>
			</figure>
			<figure class="pic1">
				<img src="images/images/t2.jpg">
				<figcaption>
					<h5>高山乌龙</h5>
					<p>重庆 普洱清茶</p>
				</figcaption>
			</figure>
			<figure class="pic1">
				<img src="images/images/t3.jpg">
				<figcaption>
					<h5>铁观音</h5>
					<p>贵州 普洱生茶</p>
				</figcaption>
			</figure>
			<figure class="pic1">
				<img src="images/images/t4.jpg">
				<figcaption>
					<h5>茉莉花茶</h5>
					<p>四川 普洱生茶</p>
				</figcaption>
			</figure>
			
		</div>
	</div>
	<div id="k1"><a href="contactus.jsp">回顶部</a></div>
	<div id="k2"><a href="teashoplist.jsp">茶具商店</a></div>
	<div id="k3"><a href="">联系客服</a></div>
</div>

<div id="footer">
		<div id="footer1">
			<img src="images/images/logo.png">
		</div>
		<div id="footer2">
			<table id="table1">
				<tr>
					<td></td>
					<td>咨询热线：</td>
				</tr>
				<tr>
					<td></td>
					<td>0371-6645209</td>
				</tr>
				<tr style="height:15px">
					<td></td>
					<td></td>
				</tr>
				<tr>
					<td></td>
					<td>地址：</td>
				</tr>
				<tr>
					<td></td>
					<td>河南省郑州市中原区梧桐街道A区</td>
				</tr>
				<img src="images/images/tub.png">
			</table>
		</div>
		<div id="footer3">
			<img src="images/images/ma.jpg">
			<p><b>关注公司官方账号</b></p>
		</div>
		<div id="footer4">
			<table id="table2">
				<tr class="tr">
					<td><b>品牌文化</b></td>
					<td><b>茶品展示</b></td>
					<td><b>营销服务</b></td>
					<td><b>友情链接</b></td>
					<td><b>茶具商店</b></td>
				</tr>
				<tr>
					<td><b>品牌介绍</b></td>
					<td><b>普洱生茶</b></td>
					<td><b>店面查询</b></td>
					<td><b>小罐茶</b></td>
					<td><b>陈檀香木茶具</b></td>
				</tr>
				<tr>
					<td><b>茶之文化</b></td>
					<td><b>普洱熟茶</b></td>
					<td><b>官方旗舰店</b></td>
					<td><b>乌龙蜜茶</b></td>
					<td><b>皇家器具</b></td>
				</tr>
				<tr>
					<td><b>茶之文化</b></td>
					<td><b>西湖龙井</b></td>
					<td></td>
					<td><b>云和数据</b></td>
					<td><b>双虎家私</b></td>
				</tr>
				<tr>
					<td><b>茶之健康</b></td>
					<td><b>大红袍</b></td>
					<td></td>
					<td><b>郑州航院</b></td>
					<td><b>魅红茶杯</b></td>
				</tr>
				<tr>
					<td><b>茶之品享</b></td>
					<td><b>茉莉花茶</b></td>
					<td></td>
					<td></td>
					<td></td>
				</tr>
			</table>
		</div>
		<div id="last">CopyRight 2012 云茗茶坊 All Right Reserved 豫ICP备12004376号 技术支持  ：云和数据</div>
	</div>

</body>
</html>